<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>下载数据包</title>
	<link href="http://cdn.bootcss.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet">
	<script src="http://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>
	<link href="http://cdn.bootcss.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet">
	<script src="http://cdn.bootcss.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
</head>
<body style="background: #33b2e2">
<div style="width:1100px;margin: 10px auto;">
	<div style="background: url(http://dev.hdcms.com/resource/images/logo.png) no-repeat;background-size:contain;height:80px;"></div>
	<br/>
	<div class="panel panel-default">
		<nav class="navbar navbar-default alert-info" style="border-radius: 0px;">
			<div class="container-fluid">
				<div class="navbar-header">
					<a class="navbar-brand" href="#"><strong>HDCMS 百分百开源免费,可用于任意商业项目!</strong>
						<small class="text-info">使用高效的HDPHP框架构建</small>
					</a>
				</div>
				<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
					<ul class="nav navbar-nav navbar-right">
						<li><a href="http://www.houdunwang.com" target="_blank">培训</a></li>
						<li><a href="http://www.hdcms.com" target="_blank">官网</a></li>
					</ul>
				</div>
			</div>
		</nav>
		<div class="panel-body">
			<div class="col-xs-3">
				<div class="progress">
					<div class="progress-bar progress-bar-striped progress-bar-danger active" style="width: 80%;">
						80%
					</div>
				</div>
				<ul class="list-group">
					<li class="list-group-item"><strong>安装步骤</strong></li>
					<li class="list-group-item"><i class="fa fa-copyright"></i> 安装协议</li>
					<li class="list-group-item"><i class="fa fa-pencil-square-o"></i> 环境检测</li>
					<li class="list-group-item"><i class="fa fa-database"></i> 数据库配置</li>
					<li class="list-group-item" style="background: #dff0d8"><i class="fa fa-cloud-download"></i> 下载软件包</li>
					<li class="list-group-item"><i class="fa fa-check-circle"></i> 完成</li>
				</ul>
			</div>
			<form class="form-horizontal" method="post">
				<div class="col-xs-9">
					<div class="alert alert-info">
						服务器下载人数过多或你的网速过低都会影响下载速度,也可能造成下载失败的情况,如果下载失败,你可以尝试 <a href="http://www.hdcms.com">下载离线数据包</a>.
					</div>
					<h1>
						<div class="progress">
							<div id="progress" class="progress-bar progress-bar-striped progress-bar-success active" style="width: 0%;">
								0%
							</div>
						</div>
					</h1>
				</div>
			</form>
		</div>
	</div>
	<div class="text-center" style="color:#fff;"> © 2010 - 2019 hdcms.com Inc.</div>
</div>
</body>
</html>

<script>
	$(function () {
		//进度条
		var w = 0;
		var tid = setInterval(function () {
			w += 1;
			$("#progress").css({width: w + '%'})
			$("#progress").text(w + '%');

		}, 800);
		//下载包
		$.get('?a=downloadFile', function (status) {
			if (status == 1) {
				$("#progress").css({width: '100%'})
				$("#progress").text('100%');
				clearInterval(tid);
				location.href = '?a=table';
			} else {
				alert('当前下载量太大,暂时无法提供下载,您可以去官网下载离线安装包');
				window.history.back();
			}
		});
	})
</script>